/*
* @Author: Marte
* @Date:   2017-11-28 16:10:13
* @Last Modified by:   Marte
* @Last Modified time: 2017-12-19 16:42:55
*/
html,body{
  width:100%;
  height:100%;
}
body{
  padding-top:50px;
  background-color: white;
  background-color:#081633;
  overflow:scroll;
  overflow-y:hidden;
  overflow-x:hidden;
}

a:hover,
a:focus,
a:visited{
  text-decoration:none;
}


.tab-self{
  position:fixed;
  top:0px;
  left:0px;
  width:100%;
  height:50px;
  background-color:black;
  opacity:1;
  list-style: none;
  margin-bottom:10px;
}
.tab-self li{
  float:left;
  display:inline-block;
  height:100%;
  background-color:black;
  opacity:1;
}
.tab-self li a{
  display:inline-block;
  font-size:16px;
  line-height:50px;
  height:100%;
  padding:0px 20px;
  color:lightgray;
}


.tab-self li a:hover{
  color:white;
}
.tab-self li.active{
  border-bottom: 2px solid #ffd323;
}
.tab-self li.active a{
  color:#ffd323;
}

/* label checkbox */
/* .btn-group label.active,
.btn-group label.active:hover,
.btn-group label.active:focus{
  background-color:rgb(31, 32, 128)
} */
.btn-group label.btn-primary{
  background-color:rgb(160, 218, 247);
}
.btn-group label.btn-primary.active{
  background-color: rgb(20, 21, 126);
}



/*container*/
.container{
  width:100% !important;
}

.container-self{
  margin:0px;
  width:100%;
  height:100%;
}
#person-chart-container{
  padding:0px;
}
/*图表样式*/
.chart-bar{

}

/*load animation*/
.cloth {
  position:fixed;
  background-color:#291633;
  display:flex;
  align-items: center;
  justify-content:center;
  left:0px;
  top:0px;
  width:100%;
  height:100%;
  z-index: 9999;
}
.animate-box{
  position:absolute;
  margin:0 auto;
}
.loader--audioWave {
  width: 3em;
  height: 2em;
  background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#9b59b6, #9b59b6) 0.625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%;
  background-repeat: no-repeat;
  background-size: 0.5em 0.25em, 0.5em 0.25em, 0.5em 0.25em, 0.5em 0.25em, 0.5em 0.25em;
  animation: audioWave 1.5s linear infinite;
}
@keyframes audioWave {
  25% {
    background: linear-gradient(#3498db, #3498db) 0 50%, linear-gradient(#9b59b6, #9b59b6) 0.625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%;
    background-repeat: no-repeat;
    background-size: 0.5em 2em, 0.5em 0.25em, 0.5em 0.25em, 0.5em 0.25em, 0.5em 0.25em;
  }
  37.5% {
    background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#3498db, #3498db) 0.625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%;
    background-repeat: no-repeat;
    background-size: 0.5em 0.25em, 0.5em 2em, 0.5em 0.25em, 0.5em 0.25em, 0.5em 0.25em;
  }
  50% {
    background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#9b59b6, #9b59b6) 0.625em 50%, linear-gradient(#3498db, #3498db) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%;
    background-repeat: no-repeat;
    background-size: 0.5em 0.25em, 0.5em 0.25em, 0.5em 2em, 0.5em 0.25em, 0.5em 0.25em;
  }
  62.5% {
    background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#9b59b6, #9b59b6) 0.625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#3498db, #3498db) 1.875em 50%, linear-gradient(#9b59b6, #9b59b6) 2.5em 50%;
    background-repeat: no-repeat;
    background-size: 0.5em 0.25em, 0.5em 0.25em, 0.5em 0.25em, 0.5em 2em, 0.5em 0.25em;
  }
  75% {
    background: linear-gradient(#9b59b6, #9b59b6) 0 50%, linear-gradient(#9b59b6, #9b59b6) 0.625em 50%, linear-gradient(#9b59b6, #9b59b6) 1.25em 50%, linear-gradient(#9b59b6, #9b59b6) 1.875em 50%, linear-gradient(#3498db, #3498db) 2.5em 50%;
    background-repeat: no-repeat;
    background-size: 0.5em 0.25em, 0.5em 0.25em, 0.5em 0.25em, 0.5em 0.25em, 0.5em 2em;
  }
}

#person-chart-container{
  position:relative;

}
.inner-animate-box{
  display:flex;
  position:absolute;
  justify-content:center;
  align-items:center;
  left:0px;
  top:0px;
  width:100%;
  height:100%;
  background-color:black;
  opacity:0.3;
  z-index: 99999;
}
